{% extends "baseMenu.html" %}

{% block content %}
<table style="text-align: left; height: 100%; width: 90%;border: 3px solid rgb(0,0,0); padding:10px; box-shadow: 0px 0px 10px 10px rgba(70,70,70, 0.4) inset;background-color:rgb(255,255,255);">
    <tr>
        <td style="text-align: center; height: 100%; width: 80%;"align=center >
        <a>Usuarios Existentes</a>
        <div id="tableContainer" class="tableContainer">
        {% if userList %}
        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="scrollTable">
			<thead class="fixedHeader">
				<tr>
					<th><a href="#">Nombre</a></th>
					<th><a href="#">Email</a></th>
					<th><a href="#">Categoria</a></th>
					<th><a href="#">Empresa</a></th>
				</tr>
			</thead>
			<tbody class="scrollContent">
			{% for user in userList %}
			<tr>
				<td>{{ user.nombre }}</td>
				<td>{{ user.mail}}</td>
				<td>{{ user.categoria }}</td>
				<td>{{ user.empresa }}</td>
			</tr>
			{% endfor %}
			</tbody></table>
        {% else %}<tr><td>No hay usuarios disponibles.</td></tr>
        {% endif %}
		</div></td>
    	<td><table><tbody>
       		<tr><form name="formUsuario" action="" method="post">{% csrf_token %}
                <label for="id_usuario"> Nombre Usuario: </label> {{ form.nombre }}	
                <BUTTON type="submit" name="action" value="addUser"> Agregar Usuario </BUTTON>
                <BUTTON type="submit" name="action" value="editUser"> Modificar Usuario </BUTTON>
                <BUTTON type="submit" name="action" value="rehabUser"> Rehabilitar Usuario </BUTTON>
                <BUTTON type="submit" name="action" value="delUser" > Eliminar Usuario </BUTTON>
            </form></tr>
        </tbody></table>
    </td></tr>
    {% if error %} <tr><td style="text-align: center;"><font color="red" size=2>Error: {{ error }}</font></td></tr>{% endif %}
</table>
{% endblock %}